<template>
  <div class="repo_nav">
      <ul class="nav_list">
          <li class="nav_item"><span :class=" currentIndex == '0'? 'isShowNav':''" @click="currentNav(0)">全部</span></li>
          <li class="nav_item"><span :class=" currentIndex == '1'? 'isShowNav':''"  @click="currentNav(1)">待处理</span></li>
          <li class="nav_item"><span :class=" currentIndex == '2'? 'isShowNav':''"  @click="currentNav(2)">已完成</span></li>
      </ul>
  </div>
</template>

<script>
export default {
    name:"RepoNav",
    props:[
        'currentIndex'
    ],
    data(){
        return{
            // currentNav:'0'
        }
    }, 
    methods:{
         currentNav(index){  
             this.$emit('currentNav',index)
         }
    }
}
</script>

<style lang="less" scoped>
.nav_list{
    display: flex;
    font-size: 17px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background: #fff;
    .nav_item{
        flex: 1;
        span{
            display: inline-block;
            padding: 0 10px;
            height: 90%;
        }
    }
}
.isShowNav {
    color: #28C08D;
    border-bottom: 2px solid #28C08D;
}
</style>